<script setup>
import {ref,onMounted} from 'vue';
import http from '@/utils/http.js'
const list = ref([]);

const getArticleList = async () => {
    const response = await http.get('/article/list');
    list.value = response.data;
}

onMounted(() => {
    console.log('请求信息');
    getArticleList();
})
</script>

<template>
<el-container style="width: 80%; margin: 0 auto">
    <el-main>
      <el-row>
        <el-col>
            <el-card v-for="articles in list" :key="articles.id">
                <el-link :href="'/article/'+articles.id" type="primary" style="font-size: 20px;">{{ articles.title}}</el-link>
                <p>发布日期：{{ articles.date }}</p>
                <p>{{ articles.summary }}</p>
            </el-card>
        </el-col>
      </el-row>
    </el-main>

    <el-aside>
        <el-card style="margin-top: 20px;">
           <h1>热门文章</h1>
        </el-card>
    </el-aside>
</el-container>
</template>

<style scoped>
</style>